import { post } from '../../axios/index'
import { useEffect, useState } from 'react'
import './leftList.less'
function LeftList(props) {
    const [list, setList] = useState([])
    const [timer, setTimer] = useState(null)
    function getData(){
        if(timer) clearTimeout(timer)
        post('/ck_electrical/api/getFacilityThermometryList', {facilityId: props.id}).then(res => {
            if(res.data.status === '200') {
                setList(res.data.data)
                setTimer(setTimeout(() => {
                    getData()
                }, 3000))
            }
        })
    }

    useEffect(() => {
        getData()
        return () => {
            if(timer) {
                clearTimeout(timer)
            }
        }
    }, [props.id, props.refech])

    function delFn (index) {
        post('/ck_electrical/api/delFacilityThermometry', {facilityId: props.id, index}).then(res => {
            if(res.data.status === '200') {
                setList([])
                getData()
            }
        })
    }

    return <div className={`${props.className} left-list`}>
        <div className="title">测温列表</div>
      {
          list.map((item, index) => <div className="row-item">
              <div className={`row-item-one ${index < list.length - 1 ? 'btn-line' : ''}`}>
                <span>{item.index+1}</span>
                <span>{`${item.type === 0 ? 'R' : item.type === 1 ? 'L' : 'P'}${item.index + 1}`}</span>
                <div className='wid-40'>
                    {item.type !== 2 ? <p>MAX</p> : '  '}
                    {item.type !== 2 ? <p>MIN</p> : '  '}
                    {item.type !== 2 ? <p>AVG</p> : '  '}
                </div>
                <div className='wid-40'>
                <p>{item.max.toFixed(1)}℃</p>
                    {item.type !== 2 ? <p>{item.min.toFixed(1)}℃</p> : '   '}
                    {item.type !== 2 ? <p>{item.avg.toFixed(1)}℃</p> : '   '}
                </div>
                <span className="del" onClick={() => delFn(item.index)}>删除</span>
              </div>
          </div>)
      }
    </div>
}

export default LeftList